<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Demo</title>
    <script src="js/three.js"></script>
    <script src="js/OrbitControls.js"></script>
    <script src="js/libs/stats.min.js"></script>
    <script src="js/libs/ThreeBSP.js"></script>
    <script src="js/loader/DDSLoader.js"></script>
    <script src="js/loader/MTLLoader.js"></script>
    <script src="js/loader/OBJLoader.js"></script>
</head>
<body>

<div id="container"></div>
<script>

    var stats;
    var container
    var camera, controls, scene, renderer,INTERSECTED;
    var raycaster = new THREE.Raycaster();
    var mouse = new THREE.Vector2();
    var onClickPosition = new THREE.Vector2();
    var closed = -0.01;
    var opened = -(Math.PI/2-0.01);
    var light,light2,lightHelper;
    init();
    animate(); // remove when using next line for animation loop (requestAnimationFrame)
    //animate();

    function init() {

        scene = new THREE.Scene();

        renderer = new THREE.WebGLRenderer();
        renderer.setClearColor( 0xffffff);
        renderer.setPixelRatio( window.devicePixelRatio );
        renderer.setSize( window.innerWidth, window.innerHeight );
        renderer.shadowMap.enabled=true;

        container = document.getElementById( 'container' );
        container.appendChild( renderer.domElement );

        camera = new THREE.PerspectiveCamera( 60, window.innerWidth / window.innerHeight, 1, 10000 );
        camera.position.z = 2000;

        controls = new THREE.OrbitControls( camera, renderer.domElement );
        controls.addEventListener( 'change', render ); // remove when using animation loop
        // enable animation loop when using damping or autorotation
        //controls.enableDamping = true;
        //controls.dampingFactor = 0.25;
        controls.enableZoom = true;

        // world

        var textureLoader = new THREE.TextureLoader();

        //geometry part

        var floorGeo = new THREE.CubeGeometry(1600,1300,1);
        var floorMat ;
        var floorMesh;

        textureLoader.load('model/texture/floor.png', function(tex) {
            floorMat = new THREE.MeshLambertMaterial({map:tex, color:0xBEC9BE, emissive:0xBEC9BE,emissiveIntensity:0.005, overdraw: false});
            floorMat.map.wrapS = THREE.RepeatWrapping;
            floorMat.map.wrapT = THREE.RepeatWrapping;
            floorMat.map.repeat.set(13,10);
            floorMesh = new THREE.Mesh(floorGeo,floorMat);
            floorMesh.position.x=600;
            floorMesh.position.y=450;
            floorMesh.receiveShadow=true;
            scene.add(floorMesh);
        });





        var shape = new THREE.Shape();
        shape.moveTo(0, 0);
        // straight line upwards
        shape.lineTo(30, 0);
        shape.lineTo(30, 270);
        shape.lineTo(0, 270);
        shape.lineTo(0, 0);


        var wallpath = [new THREE.Vector3(0,0,270/2),new THREE.Vector3(1000,0,270/2),new THREE.Vector3(1000,500,270/2),new THREE.Vector3(500,500,270/2)
            ,new THREE.Vector3(500,1000,270/2),new THREE.Vector3(0,1000,270/2)];
        var path = new THREE.Path(wallpath);
        path.autoClose=true;


        var options = {
            path:path,
            amount: 1
        };
        var wallGeo = new THREE.ExtrudeGeometry(shape,options);
        var wallMat = new THREE.MeshBasicMaterial({color:0x002288});
        var wallMesh = new THREE.Mesh(wallGeo,wallMat);
        scene.add(wallMesh);

//        var map = THREE.ImageUtils.loadTexture('model/texture/outside_lightmap.jpg');
//        var faces = result.geometry.faces;
//
//        result.geometry.faceVertexUvs[0] = [];
//        console.log("length:"+faces.length);
//        for (var i = 0; i < faces.length ; i++) {
//
//            var v1 = result.geometry.vertices[faces[i].a],
//                    v2 = result.geometry.vertices[faces[i].b],
//                    v3 = result.geometry.vertices[faces[i].c];
//            console.log("length:"+v1.x+"-"+v2.x+"-"+v3.x);
//
//            if(v1.x<0 && v2.x<0 && v3.x<0){
//                result.geometry.faceVertexUvs[0].push([
//                    new THREE.Vector2(v1.y/1000 ,v1.z/275),
//                    new THREE.Vector2(v2.y/1000 ,v2.z/275),
//                    new THREE.Vector2(v3.y/1000 ,v3.z/275)
//                ]);
//                console.log(1111);
//            }else{
//                result.geometry.faceVertexUvs[0].push([
//                    new THREE.Vector2(0,0),
//                    new THREE.Vector2(0,0),
//                    new THREE.Vector2(0,0)
//                ]);
//            }
//
//        }
//        result.geometry.uvsNeedUpdate = true;
//        var ss = new THREE.Mesh(result.geometry,new THREE.MeshLambertMaterial({
//            color:0xBEC9BE,
//            map:map
//        }));
//        ss.name="11";
//        scene.add(ss);

//        result.geometry.computeFaceNormals();
//        result.geometry.computeVertexNormals();
//        scene.add(result);





        light2 = new THREE.AmbientLight( 0xffffff );
        light2.intensity=0.8;
        scene.add( light2 );

        light = new THREE.DirectionalLight(0xffffff);
        light.intensity=0.5;
        light.castShadow = true;
        light.position.set( 500, 500, 1000 );

        var tar1 = new THREE.Object3D();
//         lightHelper= new THREE.SpotLightHelper(light);
        tar1.position.set(500,500,0);

        tar1.name="111";
        scene.add(tar1);

        console.log(tar1);
        light.target=tar1;

        scene.add( light );

//        scene.add( lightHelper );

        //

        stats = new Stats();
        container.appendChild( stats.dom );

        //

        window.addEventListener( 'resize', onWindowResize, false );
//        container.addEventListener( 'mousemove', onMouseMove, false );
//        container.addEventListener("dblclick",openClose,false);
    }

    function onWindowResize() {

        camera.aspect = window.innerWidth / window.innerHeight;
        camera.updateProjectionMatrix();

        renderer.setSize( window.innerWidth, window.innerHeight );

    }

    function animate() {

        requestAnimationFrame( animate );

        controls.update(); // required if controls.enableDamping = true, or if controls.autoRotate = true

        stats.update();

        render();

    }
//    var needOpen = 0;

    function render() {

        renderer.render( scene, camera );
//        doorSwitch(needOpen);
    }

//    function doorSwitch(on){
//        var door = scene.getObjectByName('door');
//        if(on==1){
//            door.rotation.z-=0.15;
//            if(door.rotation.z<opened){
//                needOpen=0;
//            }
//        }
//        if(on==2){
//            door.rotation.z+=0.15;
//            if(door.rotation.z>closed){
//                needOpen=0;
//            }
//        }
//    }
//    function openClose() {
//        if(INTERSECTED){
//            var door = scene.getObjectByName('door');
//            if(door.rotation.z<-(Math.PI/2-0.01)){
//                needOpen=2;
//            }
//            if(door.rotation.z>-0.01){
//                needOpen=1;
//            }
//        }
//    }
//
//
//    function assignUVs(geometry) {
//
//        geometry.faceVertexUvs[0] = [];
//
//        geometry.faces.forEach(function(face) {
//
//            var components = ['x', 'y', 'z'].sort(function(a, b) {
//                return Math.abs(face.normal[a]) > Math.abs(face.normal[b]);
//            });
//
//            var v1 = geometry.vertices[face.a];
//            var v2 = geometry.vertices[face.b];
//            var v3 = geometry.vertices[face.c];
//
//            geometry.faceVertexUvs[0].push([
//                new THREE.Vector2(v1[components[0]], v1[components[1]]),
//                new THREE.Vector2(v2[components[0]], v2[components[1]]),
//                new THREE.Vector2(v3[components[0]], v3[components[1]])
//            ]);
//
//        });
//
//        geometry.uvsNeedUpdate = true;
//    }
//    function onMouseMove( evt ) {
//
//        evt.preventDefault();
//
//        var array = getMousePosition( container, evt.clientX, evt.clientY );
//        onClickPosition.fromArray( array );
//        var door = scene.getObjectByName("door");
//
//        var intersects = getIntersects( onClickPosition, door.children );
//
//        if ( intersects.length > 0  ) {
//            INTERSECTED=door.getObjectByName("doorIn");
//            INTERSECTED.currentHex = INTERSECTED.material.emissive.getHex();
//
////            intersects[0].face.color=new THREE.Color(0xff0000);
//            INTERSECTED.material.color.setHex(0xff0000);
//
//
//
//
//        }else{
//
//            if(INTERSECTED)INTERSECTED.material.color.setHex(0xAFEEEE);
//
//            INTERSECTED=null;
//        }
//
//    }
//
//    var getMousePosition = function ( dom, x, y ) {
//
//        var rect = dom.getBoundingClientRect();
//        return [ ( x - rect.left ) / rect.width, ( y - rect.top ) / rect.height ];
//
//    }
//
//    var getIntersects = function ( point, objects ) {
//
//        mouse.set( ( point.x * 2 ) - 1, - ( point.y * 2 ) + 1 );
//
//        raycaster.setFromCamera( mouse, camera );
//
//        return raycaster.intersectObjects( objects );
//
//    }


</script>
</body>
</html>